<!DOCTYPE html>
<html lang="zh">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/header :: header(~{::title},~{::link},~{})">

    <title>周计划列表</title>
    <link rel="icon" th:href="@{/assets/img/lcxm.ico}" type="image/ico">
    <link rel="stylesheet" th:href="@{/assets/css/common.css}">
    <link rel="stylesheet" th:href="@{/assets/css/daterangepicker.css}">
</head>
<body class="body">
<!--导航-->
<div th:replace="common/nav :: nav(true)"></div>
<div class="container">

    <div class="row row-nocol">


        <form class="form-inline lookup" role="form" method="post">


            <div class="form-group" style="margin-left: 5px">
                <label class="control-label sr-only" for="lookup-weekNumber">周次</label>
                <div class="input-group">
                    <input class="form-control input-sm" id="lookup-weekNumber" name="weekNumber" type="text"
                           th:value="${pager.lookup?.weekNumber}" placeholder="周次">
                </div>
            </div>
            <div class="form-group" style="margin-left: 5px">
                <div class="input-group">
                    <input type="text" class="form-control input-sm" id="startWeekDate"
                           th:value="${#dates.format(pager.lookup?.weekStart, 'yyyy-MM-dd')}"
                           name="weekStart" readonly>
                    <span class="input-group-addon">至</span>
                    <input type="text" class="form-control input-sm" id="endWeekDate"
                           th:value="${#dates.format(pager.lookup?.weekEnd, 'yyyy-MM-dd')}"
                           name="weekEnd" readonly>
                    <input type="text" id="weekPicker" class="form-control input-sm" style="display: none;"/>
                    <span class="input-group-btn">
                            <button class="btn btn-default input-sm" type="button" id="weekRangePicker"><i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                </div>
            </div>
            <div class="form-group" style="margin-left: 5px">
                <label class="control-label sr-only" for="lookup-groupId">小组</label>
                <div class="input-group">
                    <select class="form-control input-sm" id="lookup-groupId" name="groupId"
                            th:attr="data-value=${pager.lookup?.groupId}" data-url="group/all">
                        <option value="">--请选择小组--</option>
                    </select>
                </div>
            </div>

            <div class="form-group" style="margin-left: 5px">
                <label class="control-label sr-only" for="lookup-userName">用户名</label>
                <div class="input-group">
                    <input class="form-control input-sm" id="lookup-userName" name="userName" type="text"
                           th:value="${pager.lookup?.userName}" placeholder="用户名">
                </div>
            </div>

            <div class="form-group" style="margin-left: 5px">
                <label class="control-label sr-only" for="lookup-submissionStatus">提交状态</label>
                <div class="input-group">
                    <select style="width: 100%" class="form-control input-sm" id="lookup-submissionStatus" name="submissionStatus"
                            th:attr="data-value=${pager.lookup?.submissionStatus}">
                        <option value="">选择提交状态</option>
                        <option th:each="item:${submissionStatusList}" th:value="${item.name()}" th:text="${item.text}"></option>
                    </select>
                </div>
            </div>


            <div class="form-group pull-right">
                <button type="submit" class="btn btn-primary btn-sm">
                    <i class="glyphicon glyphicon-search"></i> 查询
                </button>
                <button type="button" class="btn btn-info btn-sm reset">
                    <i class="glyphicon glyphicon-refresh"></i> 重置
                </button>
            </div>

        </form>
        <hr/>
        <!-- 操作信息提示的地方 -->
        <div th:if="${remind}" class="alert alert-${ remind.level  }"
             th:classappend="'alert-' + ${remind.level}">
            <button data-dismiss="alert" class="close" type="button">
                <i class="glyphicon glyphicon-remove"></i>
            </button>
            <span th:remove="tag" th:utext="${ remind.message }"></span>
        </div>
        <!--列表栏-->
        <form class="nocol">

            <div class="action-bar">
                <a class="btn btn-sm btn-success"  onclick="add();" data-toggle="tooltip" title="新增周计划">
                    <i class="glyphicon glyphicon-plus"></i> 新增周计划
                </a>
            </div>

            <table class="table table-striped  table-hover table-bordered stable">
                <thead>
                <tr class="text-center">
                    <th>周次</th>
                    <th>周起止日期</th>
                    <th>小组</th>
                    <th>用户名</th>
                    <th>已用工时(人天)</th>
                    <th>状态</th>
                    <th class="text-info">操作</th>
                </tr>
                </thead>
                <tbody align="center">
                <tr th:each="cur:${pager?.datas}">
                    <td th:text="${cur.weekNumber}" class="text-info">weekNumber</td>
                    <td>
                         <span class="text-success"
                               th:text="${#dates.format(cur?.weekStart, 'MM-dd')}"></span>—
                        <span class="text-success"
                              th:text="${#dates.format(cur?.weekEnd, 'MM-dd')}"></span>
                    </td>
                    <td th:text="${cur.groupName}">groupName</td>
                    <td th:text="${cur.userName}">userName</td>
                    <td th:text="${cur.actualEffort}">actualEffort</td>
                    <td ><span th:attr="data-random-label=${cur.submissionStatus?.ordinal()}" th:text="${cur.submissionStatus?.text}">group</span></td>

                    <td>
                        <div class="btn-group-dis">

                            <button  th:if="${cur.submissionStatus.name() != 'SUBMITTED'}" class="btn btn-xs btn-info action-get" type="button"
                                    th:attr="data-url='/plan/form/'+${cur.id}"
                                    data-toggle="tooltip"
                                    title="编辑" >
                                <i class="glyphicon glyphicon-edit"></i>
                            </button>
                            <button th:if="${cur.submissionStatus.name() == 'SUBMITTED'}" class="btn btn-xs btn-danger action-get" type="button"
                                    th:attr="data-url='/plan/revoke/'+${cur.id}"
                                    data-toggle="tooltip"
                                    title="撤销" data-confirm="确定撤销提交吗，撤销提交后可继续编辑周计划">
                                <i class="glyphicon glyphicon-backward"></i>
                            </button>

                            <button   class="btn btn-xs btn-success action-get" type="button"
                                     th:attr="data-url='/plan/detail/'+${cur.id}"
                                     data-toggle="tooltip"
                                     title="详情" >
                                <i class="glyphicon glyphicon-file"></i>
                            </button>

                            <button   class="btn btn-xs btn-primary action-get" type="button"
                                      th:attr="data-url='/plan/groupDetail/'+${cur.id}"
                                      data-toggle="tooltip"
                                      title="查看小组当前周次详情" >
                                <i class="glyphicon glyphicon-list-alt"></i>小组详情
                            </button>

                        </div>



                    </td>
                </tr>
                <!-- </c:forEach> -->
                </tbody>
            </table>

        </form>
        <!--页码相关-->
        <div th:replace="common/pager :: pager"></div>
    </div>


</div>

<!-- 引入通用js-->
<div th:replace="common/footer :: footer"></div>
<script th:src="@{/js/moment.min.js}"></script>
<script th:src="@{/js/daterangepicker.min.js}"></script>
<script th:src="@{/js/plan/plan.js}"></script>
<script>
    $(function (){
        //初始化week日期控件
        common.initWeekDatePicker('weekPicker','weekRangePicker','startWeekDate','endWeekDate');
    });
</script>
<script>


</script>
</body>
</html>